<template>
  <view class="task-list-container">
    <!-- 顶部轮播图 -->
    <swiper class="banner-swiper" indicator-dots circular>
      <swiper-item v-for="(item, index) in bannerList" :key="index">
        <image class="banner-img" :src="item"></image>
      </swiper-item>
    </swiper>

    <!-- 任务中心 -->
    <view class="section">
      <view class="section-title">任务中心</view>
      <u-collapse>
		  <u-collapse-item v-for="item in taskList" :key="item.id" 
		  :title="item.title" :name="item.id">
			  <u-cell v-for="it in item.paperItems">
			      	<view slot="title" class="u-slot-title">
			      		<text class="u-cell-text">{{it.examPaperName}}</text>
			      		<u-tag v-if="it.status==2" text="完成" plain size="mini" type="success">
			      		</u-tag>
						<u-tag v-if="it.status==1" text="待批改" plain size="mini" type="warning">
						</u-tag>
			      	</view>
			      </u-cell>
		  </u-collapse-item>
	  </u-collapse>
    </view>

    <!-- 固定试卷 -->
    <view class="section ">
      <view class="section-title">固定试卷</view>
	  <view class="paper1">
		  <view class="paper-item" v-for="item in paperList" :key="item.id">
			  <image src="/static/paper.png" mode=""></image>
		    <text class="paper-name">{{item.name}}</text>
			<text @click="goanswer" style="color: skyblue;">开始做题</text>
		  </view>
	  </view>
    </view>
	<!-- 时段试卷 -->
	<view class="section ">
	  <view class="section-title">时段试卷</view>
	  <view class="paper1">
		  <view class="paper-item" v-for="item in timeLimitPaperList" :key="item.id">
			  <image src="/static/paper.png" mode=""></image>
		    <text class="paper-name">{{item.name}}</text>
			<text>{{item.startTime}}</text>
			<text>{{item.endTime}}</text>
			<text @click="goanswer" style="color: skyblue;">开始做题</text>
		  </view>
	  </view>
	</view>
  </view>
</template>

<script>
	import http from '../../http';
export default {
  data() {
    return {
      // 轮播图数据
      bannerList: [
        "/static/lutou.png",
        "/static/下载1.webp",

      ],
      taskList: [],
      // 固定试卷数据
      paperList: [],
	  //时段
	  timeLimitPaperList: [],

    };
  },
  methods: {
	  getTaskList(){
		  http({
			  url:"/api/student/dashboard/task",
			  method:"post"
		  }).then(res=>{
			  console.log(res);
			  if(res.code===1){
				  this.taskList=res.response
			  }
		  })
	  },
	  getPaperList(){
		  http({
			  url:"/api/student/dashboard/index",
			  method:"post"
		  }).then(res=>{
			  console.log(res,"paper");
			  this.paperList=res.response.fixedPaper;
			  this.timeLimitPaperList=res.response.timeLimitPaper

		  })
	  },
	  goanswer(){
		  uni.navigateTo({
		  	url:"/pages/answer/answer"
		  })
	  }
  },
  onLoad() {
  	this.getTaskList()
	this.getPaperList()
  }
};
</script>

<style scoped>
	.u-slot-title{
		display: flex;
		justify-content: space-between;
	}
.task-list-container {
  padding: 15rpx;
  background-color: #fff;
}
/* 轮播图样式 */
.banner-swiper {
  height: 300rpx;
}
.banner-img {
  width: 100%;
  height: 100%;
}
/* 通用区域标题 */
.section {
  margin-top: 20rpx;
}
.section-title {
  font-size: 28rpx;
  font-weight: bold;
  color: #333;
  padding: 20rpx 0;
}
/* 任务项样式 */
.task-item {
  border-bottom: 1px solid #f5f5f5;
}
.task-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20rpx;
  font-size: 26rpx;
  color: #666;
}
.arrow {
  width: 30rpx;
  height: 30rpx;
}
/* 子菜单样式 */
.sub-menu {
  padding: 0 20rpx 20rpx 40rpx; /* 缩进体现层级 */
}
.sub-item {
  padding: 15rpx 0;
  font-size: 24rpx;
  color: #999;
}
/* 固定试卷样式 */
.paper1{
	display: flex;
	
}
.paper-item {
	width: 200rpx;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 20rpx;
  border-bottom: 1px solid #f5f5f5;
  font-size: 20rpx;
  >image{
	  width: 80rpx;
	  height: 80rpx;
  }
}

.right-arrow {
  width: 20rpx;
  height: 36rpx;
}
</style>